<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%><%@ page session="false"%>
<!DOCTYPE html>
<html lang="es-ES">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <meta name="_csrf" content="${_csrf.token}" />
        <meta name="_csrf_header" content="${_csrf.headerName}" />
        <jsp:include page="libs.jsp" flush="true" />
    </head>
    <body class="home blog">
        <jsp:include page="header.jsp" flush="true" />

        <div id="box_breadcrumb" class="clearfix">
            <div class="container">		
                Cont&aacute;ctenos
            </div>
        </div>

        <div id="box_content">
            <div class="container">
                <!--<div class="col span_16"> -->
                <div class="contacto_container col span_16">
                    <div class="login_header">
                        <div class="login_header_title">
                            <h2 class="texto Titulo">Cont&aacute;ctenos</h2>
                        </div>
                    </div>
                    <div class="login_body">
                        <form id="contacto_form" action="${pageContext.request.contextPath}/formContacto" method="post">
                            <div id="contactoform">
                                <div class="form_row">
                                    <label for="nombreContacto" class="login_form_label">Nombre:</label>&nbsp;<input type="text" class="camposContacto" id="nombreContacto" name="nombreContacto" value="">
                                </div>
                                <div class="form_row">
                                    <label for="emailContacto" class="login_form_label">Correo:</label>&nbsp;<input type="email" name="emailContacto" id="emailContacto" class="camposContacto">
                                </div>
                                <div class="form_row">
                                    <label for="asuntoContacto" class="login_form_label">Asunto</label>&nbsp;<input type="text" name="asuntoContacto" id="asuntoContacto" class="camposContacto">
                                </div>
                                <div class="form_row">
                                    <label for="mensajeContacto" class="login_form_label">Mensaje:</label><textarea name="mensajeContacto" id="mensajeContacto" class="camposContacto" rows="8"></textarea>
                                </div>
                                <div id="buttons" class="form_row">
                                    <label class="login_form_label"></label>
                                    <div id="login_button_inline">
                                        <input class="boton" value="Enviar" type=submit id="login_button">
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
                <div class="col span_7">
                    <jsp:include page="plugin_interactivo2.jsp" flush="true" />
                    <jsp:include page="plugin_interactivo3.jsp" flush="true" />
                </div>
            </div>
        </div>
        <br/>

        <!-- <jsp:include page="plugin_fotos.jsp" flush="true" /> -->
        <jsp:include page="footer.jsp" flush="true" />
        <script type="text/javascript" >
            $(document).ready(function () {
                $("#contacto_form").submit(function (e) {
                    e.preventDefault();
                    $.ajax({
                        url: $(this).attr('action'),
                        data: $(this).serialize(),
                        type: "POST",
                        success: function (response, status, xhr) {
                            if (response.status === '0') {
                                alertify.success("Se ha enviado su mensaje...");
                            } else {
                                alertify.error("No se pudo enviar su mensaje");
                            }
                        },
                        error: function (XMLHttpRequest, textStatus, errorThrown) {
                            console.log("ERROR");
                        }
                    });
                    return false;
                });
            });
        </script>
    </body>
</html>